<template>
    <div class="detail-container">
        <Top :bidDetail="bidDetail" />
        <div class="detail-content">
            <div class="content-list">
                <div class="title">项目名称</div>
                <div class="info">{{bidDetail.bidName}}</div>
            </div>
            <div class="content-list">
                <div class="title">出借金额</div>
                <div class="info">{{formatMoney(bidDetail.investAmout)}}元</div>
            </div>
            <div class="content-list">
                <div class="title">交易时间</div>
                <div class="info">{{bidDetail.investTime}}</div>
            </div>
            <div class="content-list">
                <div class="title">收益方式</div>
                <div class="info">{{bidDetail.repaymentWayName}}</div>
            </div>
            <div class="content-list">
                <div class="title">回款方式</div>
                <div class="info">3个工作日内{{bidDetail.paymentWayName}}</div>
            </div>
            <div class="content-list">
                <div class="title">历史年化</div>
                <div class="info">{{lishiRate(bidDetail.interest, bidDetail.jiaxiRate)}}</div>
            </div>
            <div class="content-list">
                <div class="title">最长期限</div>
                <div class="info"><span>{{bidDetail.investPeriod}}</span><span class="font" v-if="bidDetail.variablePeriod === 1">浮动期限</span></div>
            </div>
            <div class="content-list" v-if="Number(bidDetail.jiaxiRate) || Number(bidDetail.couponAmount) || Number(bidDetail.lcjAmount)">
                <div class="title">优惠方式</div>
                <div class="info">{{couponType(bidDetail.jiaxiRate, bidDetail.couponAmount, bidDetail.lcjAmount)}}</div>
            </div>
            <p class="agreement" v-if="bidDetail.agreements && bidDetail.agreements.length > 0">相关协议请去App查看</p>
        </div>
        <div class="detail-return-money">
            <div class="title">
                回款明细
            </div>
            <div class="not-reached" v-if="!bidDetail.repaymentPlan || bidDetail.repaymentPlan.length === 0">
                本项目收益起始日预计为<span>{{bidDetail.dateOfValue}}</span>，到时会产生回款明细，请耐心等待
            </div>
            <Plan :bidDetail="bidDetail" v-else />
        </div>
    </div>
</template>

<script>
  import axios from '~/plugins/axios'
  import { Toast, Indicator } from 'mint-ui'
  import formatMoney from '~/helper/formatMoney'
  import Top from '../../components/investDetail/investdetail-top'
  import Plan from '../../components/investDetail/repayment-plan'
  export default {
    middleware: 'auth',
    head () {
      return {
        title: '交易详情'
      }
    },
    data () {
      return {
        bidDetail: {}
      }
    },
    components: {
      Top, Plan
    },
    mounted () {
      console.log(this.$route.params)
      if (this.$route.params && this.$route.params.id) {
        Indicator.open()
        const datas = {recordId: this.$route.params.id}
        axios.post('/api/biddetail', datas).then((resp) => {
          Indicator.close()
          console.log(resp.data)
          if (resp && resp.data && resp.data.status === 0) {
            this.bidDetail = resp.data.body
          } else {
            Toast(resp.data.message || resp.data.responseMessage)
          }
        }).catch(errors => {
          Indicator.close()
          Toast('接口异常')
        })
      }
    },
    methods: {
      formatMoney (money) {
        if (money) {
          return formatMoney.formatMoney(money)
        }
        return money
      },
      couponType (jiaxiRate, couponAmount, lcjAmount) {
        if (Number(jiaxiRate)) {
          return '加息券加息' + jiaxiRate + '%'
        } else if (Number(couponAmount)) {
          return '抵扣券抵扣' + couponAmount + '元'
        } else if (Number(lcjAmount)) {
          return '抵用金抵扣' + lcjAmount + '元'
        }
      },
      lishiRate (interest, jiaxiRate) {
        if (Number(jiaxiRate)) {
          return (interest * 100).toFixed(2) + '% + ' + jiaxiRate + '%'
        } else {
          return (interest * 100).toFixed(2) + '%'
        }
      }
    }
  }
</script>
<style lang='sass' src='~/assets/sass/biddetail.sass'></style>